<template>
	<el-main>
		<el-card>
			<div class="topAdd">
				<div class="top">
					<div class="text">{{text}}</div>
					<div class="warn" v-if="type!=0">
						<el-icon size="14"><el-icon-Warning /></el-icon>
						<text>调整【生产数量】或【计量单位】后，需点击【刷新物料】方可更改下表中的【所需数量】及【所需费用】。</text>
					</div>
					<div class="btnType" v-if="type==0">
                        <div class="btn">已审核</div>
                        <img class="img" src="@/assets/img/goDetail.png" />
						<div class="btn">工序<el-icon size="14"><el-icon-CaretBottom /></el-icon></div>
                        <img class="img" src="@/assets/img/goDetail.png" />
						<div class="btn">质检<el-icon size="14"><el-icon-CaretBottom /></el-icon></div>
                        <img class="img" src="@/assets/img/goDetail.png" />
						<div class="btn">完工<el-icon size="14"><el-icon-CaretBottom /></el-icon></div>
                    </div>
                    <div class="caozuo" v-if="type==0">
                        <div class="btn print">打印<el-icon size="14" style="margin-left:2px;"><el-icon-Printer /></el-icon></div>
                        <div class="btn">批量操作<el-icon size="14" style="margin-left:2px;"><el-icon-CaretBottom /></el-icon> </div>
                    </div>
				</div>
				<div class="topData" v-if="type!=0">
					<el-form ref="form" :model="form" label-width="120px" style="margin-top: 20px">
						<el-row>
							<el-col :span="8">
								<el-form-item label="客户原始单号" prop="orderNo">
									<el-input v-model="form.orderNo"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="生产商品" prop="goods" required>
									<el-cascader v-model="form.goods" :options="depts" :props="deptsProps" clearable style="width: 100%"></el-cascader>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="规格型号" prop="specModel">
									<el-input v-model="form.specModel"></el-input>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="8">
								<el-form-item label="订单数量" prop="orderNum">
									<el-input v-model="form.orderNum"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="生产数量" prop="produceNum" required>
									<el-cascader v-model="form.produceNum" :options="depts" :props="deptsProps" clearable style="width: 100%"></el-cascader>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="计量单位" prop="unit" required>
									<el-select v-model="form.unit" clearable style="width: 100%" filterable>
										<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
									</el-select>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="8">
								<el-form-item label="优先级" prop="goodsSpec">
									<el-select v-model="form.goodsSpec" clearable style="width: 100%">
										<el-option v-for="item in youXian" :key="item.value" :label="item.label" :value="item.value" />
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="计划完工日期" prop="overDate" required>
									<el-date-picker type="date" placeholder="选择日期" v-model="form.overDate" style="width: 100%"></el-date-picker>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="备注内容" prop="remark">
									<el-input v-model="form.remark"></el-input>
								</el-form-item>
							</el-col>
						</el-row>
					</el-form>
				</div>
                <div class="topData" style="display:flex;" v-else>
                    <div class="left" style="width:100%">
                        <el-form ref="form" :model="form" label-width="100px" style="margin-top: 20px">
                            <el-row>
                                <el-col :span="5">
                                    <el-form-item label="生产单号" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" style="margin-left:30px">
                                    <el-form-item label="客户订单号" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" style="margin-left:30px">
                                    <el-form-item label="计划数" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" style="margin-left:30px">
                                    <el-form-item label="计划完工" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="5">
                                    <el-form-item label="产品编号" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" style="margin-left:30px">
                                    <el-form-item label="产品名称" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" style="margin-left:30px">
                                    <el-form-item label="规格型号" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" style="margin-left:30px">
                                    <el-form-item label="条形码" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-col :span="5">
                                    <el-form-item label="质检合格" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" style="margin-left:30px">
                                    <el-form-item label="已入库数" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" style="margin-left:30px">
                                    <el-form-item label="实际完工" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5" style="margin-left:30px">
                                    <el-form-item label="预算费用" prop="remark">
                                        <el-input v-model="form.remark" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </el-form>
                    </div>
                    <div class="right">
                        <el-input
                            v-model="remark"
                            placeholder="备注"
                            show-word-limit
                            :rows="6"
                            resize="none"
                            type="textarea"
                        />
                    </div>
                </div>
			</div>
		</el-card>
		<div class="center">
			<el-tabs tab-position="top">
				<el-tab-pane label="1.所需物料">
					<div class="display">
						<div class="btn">添加物料<el-icon size="14"><el-icon-CaretBottom /></el-icon></div>
						<div class="btn" v-if="type==0">调整物料仓库</div>
						<div class="btn" v-if="type==0">提请采购物料</div>
						<!-- <div class="warn">
							<el-icon size="14"><el-icon-Warning /></el-icon>
							<text >温馨提示:【可用库存数】列表内容,如果标为红色,表示库存不足。</text>
						</div> -->
					</div>
					<el-card shadow="never">
						<scTable ref="table" :data="wuLiaoData" row-key="id" stripe hidePagination hideDo>
							<el-table-column label="编号" prop="id" width="50" align="center"></el-table-column>
							<el-table-column label="操作" width="130" align="center">
								<template #default="scope">
									<div class="btnDisplay">
										<div class="btn" @click="handleModify(scope.$index,scope.row)">修改</div>
										<div class="btn" @click="handleDelete(scope.$index,scope.row)">删除</div>
									</div>
								</template>
							</el-table-column>
							<el-table-column label="编号" prop="number" width="100" align="center"></el-table-column>
							<el-table-column label="名称" prop="name" width="100" align="center"></el-table-column>
							<el-table-column label="规格型号" prop="goodsSpec" width="100" align="center"></el-table-column>
							<el-table-column label="可用库存数" prop="useKuNum" width="100" align="center"></el-table-column>
							<el-table-column label="待入库数" prop="useKuNum" width="100" align="center" v-if="type==0"></el-table-column>
							<el-table-column label="单位所需数量" prop="useKuNum" width="100" align="center" v-if="type==0"></el-table-column>
                            <el-table-column label="所需数量" prop="useNum" width="100" align="center"></el-table-column>
                            <el-table-column label="已请购数" prop="useNum" width="100" align="center" v-if="type==0"></el-table-column>
                            <el-table-column label="所需费用" prop="usePrice" width="100" align="center"></el-table-column>
                            <el-table-column label="物料使用情况统计" align="center" v-if="type==0">
                                <el-table-column label="领料数" prop="useNum" width="70" align="center"></el-table-column>
                                <el-table-column label="已用数" prop="useNum" width="70" align="center"></el-table-column>
                                <el-table-column label="已退数" prop="useNum" width="70" align="center"></el-table-column>
                                <el-table-column label="报废数" prop="useNum" width="70" align="center"></el-table-column>
                                <el-table-column label="剩余数" prop="useNum" width="70" align="center"></el-table-column>
                            </el-table-column>
							<!-- <el-table-column label="物料仓库" prop="wuCang" width="100" align="center"></el-table-column>. -->
							<el-table-column label="备注" prop="remark" width="100" align="center"></el-table-column>
						</scTable>
					</el-card>
				</el-tab-pane>
				<el-tab-pane label="2.生产工序">
					<div class="display" v-if="type!=0">
						<div class="btn">选择添加<el-icon size="14"><el-icon-CaretBottom /></el-icon></div>
						<div class="btn">单条添加<el-icon size="14"><el-icon-CaretBottom /></el-icon></div>
					</div>
                    <div class="display" v-else>
						<div class="btn">批量添加工序</div>
						<div class="btn" @click="openNei">添加内部工序</div>
						<div class="btn" @click="openWei">批量委外工序</div>
					</div>
					<el-card shadow="never">
						<scTable ref="table" :data="proData" row-key="id" stripe hidePagination hideDo v-if="type!=0">
							<el-table-column label="编号" prop="id" width="50" align="center"></el-table-column>
							<el-table-column label="操作" width="130" align="center">
								<template #default="scope">
									<div class="btnDisplay">
										<div class="btn" @click="handleModify(scope.$index,scope.row)">修改</div>
										<div class="btn" @click="handleDelete(scope.$index,scope.row)">删除</div>
									</div>
								</template>
							</el-table-column>
							<el-table-column label="执行顺序" prop="order" width="130" align="center"></el-table-column>
							<el-table-column label="工序名称" prop="name" width="130" align="center"></el-table-column>
							<el-table-column label="负责人" prop="head" width="130" align="center"></el-table-column>
							<el-table-column label="类别" prop="category" width="130" align="center"></el-table-column>
							<el-table-column label="计费方式" prop="chargType" width="130" align="center"></el-table-column>
							<el-table-column label="工序单价" prop="price" width="130" align="center"></el-table-column>
							<el-table-column label="所需费用" prop="usePrice" width="130" align="center"></el-table-column>
							<el-table-column label="参考用时" prop="referTime" width="130" align="center"></el-table-column>
							<el-table-column label="加工厂商" prop="manufacturer" width="130" align="center"></el-table-column>
							<el-table-column label="备注" prop="remark" width="130" align="center"></el-table-column>
						</scTable>
                        <scTable ref="table" :data="proData" row-key="id" stripe hidePagination hideDo v-else>
							<el-table-column label="编号" prop="id" width="50" align="center"></el-table-column>
							<el-table-column label="操作" width="110" align="center">
								<template #default="scope">
									<div class="btnDisplay">
										<div class="btn" @click="handleModify(scope.$index,scope.row)">修改</div>
										<div class="btn" @click="handleDelete(scope.$index,scope.row)">删除</div>
									</div>
								</template>
							</el-table-column>
                            <el-table-column label="工序汇报" width="130" align="center">
								<template #default="scope">
									<div class="btnDisplay">
										<div class="btn" @click="open(scope.$index,scope.row)">汇报</div>
										<div class="btn" @click="handleDelete(scope.$index,scope.row)">结束</div>
										<div class="btn" @click="handleDelete(scope.$index,scope.row)">详情</div>
									</div>
								</template>
							</el-table-column>
							<el-table-column label="执行顺序" prop="order" width="90" align="center"></el-table-column>
							<el-table-column label="编号" prop="order" width="90" align="center"></el-table-column>
							<el-table-column label="名称" prop="name" width="90" align="center"></el-table-column>
							<el-table-column label="负责人" prop="head" width="90" align="center"></el-table-column>
                             <el-table-column label="工序汇报情况统计" align="center" v-if="type==0">
                                <el-table-column label="派工数" prop="order" width="65" align="center"></el-table-column>
                                <el-table-column label="合格数" prop="order" width="65" align="center"></el-table-column>
                                <el-table-column label="报废数" prop="order" width="65" align="center"></el-table-column>
                                <el-table-column label="剩余数" prop="order" width="65" align="center"></el-table-column>
                            </el-table-column>
							<el-table-column label="工序状态" prop="category" width="90" align="center"></el-table-column>
							<el-table-column label="工序单价" prop="price" width="90" align="center"></el-table-column>
							<el-table-column label="所需费用" prop="usePrice" width="90" align="center"></el-table-column>
							<el-table-column label="类别" prop="category" width="90" align="center"></el-table-column>
							<el-table-column label="计费方式" prop="chargType" width="90" align="center"></el-table-column>
							<el-table-column label="参考用时" prop="referTime" width="90" align="center"></el-table-column>
							<el-table-column label="备注" prop="remark" width="90" align="center"></el-table-column>
						</scTable>
					</el-card>
				</el-tab-pane>
				<el-tab-pane label="3.加工费用">
					<div class="add">添加</div>
                    <el-card shadow="never">
						<scTable ref="table" :data="proData" row-key="id" stripe hidePagination hideDo border>
							<el-table-column label="" prop="id" width="50" align="center"></el-table-column>
							<el-table-column label="操作" width="130" align="center">
								<template #default="scope">
									<div class="btnDisplay">
										<div class="btn" @click="handleModify(scope.$index,scope.row)">修改</div>
										<div class="btn" @click="handleDelete(scope.$index,scope.row)">删除</div>
									</div>
								</template>
							</el-table-column>
							<el-table-column label="费用名称" prop="order" width="130" align="center"></el-table-column>
							<el-table-column label="单间费用(¥)" prop="name" width="130" align="center"></el-table-column>
							<el-table-column label="备注" prop="remark" width="130" align="center"></el-table-column>
						</scTable>
					</el-card>
				</el-tab-pane>
				<el-tab-pane label="4.附件"> </el-tab-pane>
			</el-tabs>
		</div>
        <!-- 汇报弹窗 -->
        <el-dialog v-model="dialog1" draggable title="工序汇报" width="40%">
            <div class="dialog">
                <el-row>
                    <el-col :span="11">
                        <el-form-item label="生产单号" prop="remark">
                            <el-input v-model="form.remark" readonly></el-input>
                            </el-form-item>
                    </el-col>
                    <el-col :span="11" style="margin-left:30px">
                        <el-form-item label="客户订单号" prop="remark">
                            <el-input v-model="form.remark" readonly></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="11">
                        <el-form-item label="计划数" prop="remark">
                            <el-input v-model="form.remark" readonly></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11" style="margin-left:30px">
                        <el-form-item label="计划完工" prop="remark">
                            <el-input v-model="form.remark" readonly></el-input>
                        </el-form-item>
                </el-col>
            </el-row>
            </div>
            <div class="diaText">本次汇报信息</div>
                <el-form
                    ref="form"
                    :model="wuLiaoData"
                    label-width="120px"
                    style="margin-top: 20px"
                >
                    <el-row>
                        <el-col :span="11">
                            <el-form-item label="加工人员" prop="dept_id" required>
                                <el-cascader
                                    v-model="form.dept_id"
                                    :options="depts"
                                    :props="deptsProps"
                                    clearable
                                    style="width: 100%"></el-cascader>
                            </el-form-item>
                        </el-col>
                        <el-col :span="11">
                            <el-form-item label="检验员" width="120">
                                <el-input v-model="form.name"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="11">
                            <el-form-item label="合格数量" width="120" required>
                                <el-input v-model="form.name"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="11">
                            <el-form-item label="报废数量" width="120">
                                <el-input v-model="form.name"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="11">
                            <el-form-item label="加工开始" width="120">
                                <!-- <el-input v-model="form.name"></el-input> -->
                                <el-date-picker
                                    type="date"
                                    placeholder="选择日期"
                                    v-model="form.startDate"
                                ></el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col :span="11">
                            <el-form-item label="加工结束" width="120">
                                <!-- <el-input v-model="form.name"></el-input> -->
                                <el-date-picker
                                    type="date"
                                    placeholder="选择日期"
                                    v-model="form.endDate"
                                ></el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>
                     <el-row>
                        <el-col :span="11">
                            <el-form-item label="单件工时" width="120">
                                <el-input v-model="form.name"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="11">
                            <el-form-item label="合计工时" width="120">
                                <el-input v-model="form.name"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                     <el-row>
                        <el-col :span="11">
                            <el-form-item label="主管" width="120">
                                <el-input v-model="form.name"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="11">
                            <el-form-item label="备注" width="120">
                                <el-input v-model="form.name"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            <template #footer>
                <el-button @click="dialog1 = false">取 消</el-button>
                <el-button type="primary" @click="dialog1 = false">确 定</el-button>
            </template>
        </el-dialog>
        <!-- 内部工序 -->
        <el-dialog v-model="nei" draggable title="添加委外工序" width="30%">
            <el-form ref="form" :model="neiDate" label-width="120px">
                <el-form-item label="工序名称：" prop="name" required>
                    <el-input v-model="neiDate.name"></el-input>
                </el-form-item>
                <el-form-item label="执行顺序：" prop="order" required>
                    <el-input v-model="neiDate.order"></el-input>
                </el-form-item>
                <el-form-item label="负责人：" prop="human">
                    <div class="iconDis">
                        <el-input v-model="neiDate.human" readonly></el-input>
                        <el-button icon="el-icon-MoreFilled" @click="openFuZe"></el-button>
                    </div> 
                </el-form-item>
                <el-form-item label="计费方式：" prop="type">
                    <el-select v-model="neiDate.type" clearable style="width:100%">
                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select>
                </el-form-item>
                <el-form-item label="加工单价(¥)：" prop="price">
                    <el-input v-model="neiDate.price"></el-input>
                </el-form-item>
                <el-form-item label="参考用时：" prop="time">
                    <div class="time">
                        <el-input v-model="neiDate.time" style="width:90%"></el-input>
                        <div class="hour">小时</div>
                    </div>
                </el-form-item>
                <el-form-item label="备注：" prop="remark">
                    <el-input type="textarea" v-model="neiDate.remark"></el-input>
                </el-form-item>
            </el-form>
            <template #footer>
                <el-button @click="nei = false">取 消</el-button>
                <el-button type="primary" @click="nei = false">确 定</el-button>
            </template>
        </el-dialog>
        <!-- 委外工序 -->
        <el-dialog v-model="wei" draggable title="添加内部工序" width="30%">
                <el-form ref="form" :model="neiDate" label-width="120px">
                    <el-form-item label="工序名称：" prop="name" required>
                        <el-input v-model="neiDate.name"></el-input>
                    </el-form-item>
                    <el-form-item label="执行顺序：" prop="order" required>
                        <el-input v-model="neiDate.order"></el-input>
                    </el-form-item>
                    <el-form-item label="负责人：" prop="human">
                        <div class="iconDis">
                            <el-input v-model="neiDate.human" readonly></el-input>
                            <el-button icon="el-icon-MoreFilled" @click="openFuZe"></el-button>
                        </div> 
                    </el-form-item>
                    <el-form-item label="计费方式：" prop="type">
                        <el-select v-model="neiDate.type" clearable style="width:100%">
                            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
                        </el-select>
                    </el-form-item>
                     <el-form-item label="加工厂商" prop="human">
                        <div class="iconDis">
                            <el-input v-model="neiDate.human" readonly></el-input>
                            <el-button icon="el-icon-MoreFilled" @click="openJia"></el-button>
                        </div> 
                    </el-form-item>
                    <el-form-item label="加工单价(¥)：" prop="price">
                        <el-input v-model="neiDate.price"></el-input>
                    </el-form-item>
                    <el-form-item label="参考用时：" prop="time">
                        <div class="time">
                            <el-input v-model="neiDate.time" style="width:90%"></el-input>
                            <div class="hour">小时</div>
                        </div>
                    </el-form-item>
                    <el-form-item label="备注：" prop="remark">
                        <el-input type="textarea" v-model="neiDate.remark"></el-input>
                    </el-form-item>
                </el-form>
                <template #footer>
                    <el-button @click="wei = false">取 消</el-button>
                    <el-button type="primary" @click="wei = false">确 定</el-button>
                </template>
        </el-dialog>
        <!-- 负责人 -->
        <el-dialog v-model="fuZe" draggable title="选择负责人" width="30%">
            <div class="pinDisplay">
                <el-input v-model="fuZeKey" placeholder="负责人" style="width:30%" />
                <div class="btn">查询</div>
                <div class="btn">添加</div>
            </div>
            <div class="table" style="margin-top:10px;">
                <scTable ref="table" :data="fuZeName" row-key="id" stripe hideDo border>
                    <el-table-column prop="id" width="40" align="center"></el-table-column>
                    <el-table-column type="selection" width="50" align="center"></el-table-column>
                    <el-table-column label="名称" prop="name" width="130" align="center" sortable></el-table-column>
                </scTable>
            </div>
            <template #footer>
                <span class="dialog-footer">
                    <el-button type="primary"  @click="fuZe = false">确定</el-button>
                    <el-button @click="fuZe = false">取消</el-button>
                </span>
            </template>
        </el-dialog>
        <!-- 加工厂商 -->
         <el-dialog v-model="jiaGong" draggable title="选择加工厂商" width="30%">
            <div class="pinDisplay">
                <el-input v-model="fuZeKey" placeholder="加工厂商" style="width:30%" />
                <div class="btn">查询</div>
                <div class="btn">添加</div>
            </div>
            <div class="table" style="margin-top:10px;">
                <scTable ref="table" :data="fuZeName" row-key="id" stripe hideDo border>
                    <el-table-column prop="id" width="40" align="center"></el-table-column>
                    <el-table-column type="selection" width="50" align="center"></el-table-column>
                    <el-table-column label="名称" prop="name" width="130" align="center" sortable></el-table-column>
                </scTable>
            </div>
            <template #footer>
                <span class="dialog-footer">
                    <el-button type="primary"  @click="jiaGong = false">确定</el-button>
                    <el-button @click="jiaGong = false">取消</el-button>
                </span>
            </template>
        </el-dialog>
	</el-main>
</template>

<script>
    export default {
        data() {
            return {
                id: this.$route.query.id,
                text:'新增生产任务',
                type:this.$route.query.type,
                dialog1: false,
                nei: false,
                wei: false,
                fuZe: false,
                jiaGong: false,
                remark:'',
                form: {
                    remark: "",
                    overData: "",
                    goodsSpec: "",
                    unit: "",
                    produceNum: "",
                    specModel: "",
                    goods: "",
                    orderNo: "",
                    name:"",
                },
                neiDate:{
                    name:"",
                    order:"",
                    human:"",
                    price:"",
                    type:"",
                    remark:"",
                    time:""
                },
                wuLiaoData: [
                    {
                        id: 0,
                        name: "名称1",
                        goodsSpec: "无",
                        useKuNum: "未审核",
                        data: "2020-09-11",
                        number: "12343",
                        useNum: "1",
                        usePrice: "1000",
                        wuCang: "仓库1",
                        remark: "暂无备注",
                    },
                    {
                        id: 1,
                        name: "名称2",
                        goodsSpec: "无",
                        useKuNum: "未审核",
                        data: "2020-09-11",
                        number: "23132",
                        useNum: "2",
                        usePrice: "2000",
                        wuCang: "仓库2",
                        remark: "暂无备注",
                    },
                    {
                        id: 2,

                        name: "名称3",
                        goodsSpec: "无",
                        useKuNum: "未审核",
                        data: "2020-09-11",
                        number: "33231",
                        useNum: "3",
                        usePrice: "3000",
                        wuCang: "仓库3",
                        remark: "暂无备注",
                    },
                ],
                proData: [
                    {
                        id: 0,
                        order: "1",
                        name: "名称3",
                        head: "胡某",
                        category: "未审核",
                        chargType: "计件",
                        price: "3000",
                        usePrice: "3000",
                        referTime: "10",
                        manufacturer: "福建",
                        remark: "暂无备注",
                    },
                ],

                options: [
                    {
                        value: "1",
                        label: "个",
                    },
                    {
                        value: "2",
                        label: "cps",
                    },
                ],
                // 级别
                youXian:[
                    {
                        value: "1",
                        label: "常规",
                    },
                    {
                        value: "2",
                        label: "较急",
                    },
                    {
                        value: "3",
                        label: "紧急",
                    },
                    {
                        value: "4",
                        label: "特急",
                    },
                ],
                fuZeName:[
                    {id:0,name:"名称1" },
                    {id:1,name:"名称2" },
                    {id:2,name:"名称3" },
                    {id:3,name:"名称4" },
                ],
            };
        },
        mounted() {
            // this.$store.commit("updateViewTagsTitle", this.id?`CURD编辑ID:${this.id}`:"CURD新增")
            if(this.id){
                if(this.type==0){
                    this.text = '生产加工'
                }
            }
        },
        methods: {
            handleModify(row) {
                console.log('row :>> ', row);
            },
            handleDelete(row){
                console.log('row :>> ', row);
            },
            // 汇报
            open(row){
                console.log('row :>> ', row);
                this.dialog1 = true
            },
            // 内部工序
            openNei(){
                this.nei = true
            },
            // 委外工序
            openWei(){
                this.wei = true
            },
            openFuZe(){
                this.fuZe = true
            },
            openJia(){
                this.jiaGong = true
            },
        },
    };
</script>

<style lang="scss" scoped>

.topAdd {
	.top {
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
		.text {
			font-size: 20px;
		}
		.warn {
			display: flex;
			align-items: center;
			color: #f9686b;
			background: #feefef;
			padding: 2px 6px;
		}
	}
    .topData{
        margin-top: 15px;
    }
}
.center {
	margin: 15px;
	.display {
		display: flex;
		align-items: center;
		margin-bottom: 15px;

		.btn,
		.warn {
			display: flex;
			align-items: center;
			justify-content: center;
			margin-right: 10px;
		}
		.btn {
			background: #11d1b0;
			color: #fff;
			padding: 10px;
			border-radius: 8px;
	        cursor: pointer;

		}
		.warn {
			color: #f9686b;
			background: #feefef;
			padding: 2px 6px;
		}
	}
}
.btnDisplay {
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	.btn {
		color: #2666f9;
		margin: 0 5px;
	}
}
.btnType{
    display: flex;
    align-items: center;
    font-size: 14px;
    .btn{
        background: #11d1b0;
        color: #fff;
        padding: 10px 20px;
        border-radius: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        // text-align: center;
        cursor: pointer;
    }
    .img{
        width: 25px;
        height: 15px;
        margin: 0 10px;
    }
   
}
.caozuo{
    display: flex;
    align-items: center;
    font-size: 14px;
    .btn{
        padding: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        margin: 0 5px;
        color: #666666;
        background: #fff;
        border: 1px solid #d5d5d5;
    }
    .print{
        color: #11d1b0;
        background: #fff;
        border: 1px solid #11d1b0;
    }
}
.add {
    margin-bottom: 15px;
	background: #11d1b0;
	color: #fff;
	padding: 5px;
	border-radius: 8px;
	width: 50px;
	text-align: center;
    cursor: pointer;
}
.dialog{
    border-top: 1px solid #f6f6f6;
    padding: 15px 0 0;
}
.diaText{
    border-bottom: 1px solid #f6f6f6;
    padding: 15px 0;
    font-size: 18px;
    font-weight: 600;
    color: #333;
}
.time{
    width: 100%;
    display: flex;
    align-items: center;
    .hour{
        border: 1px solid #c1c5cd;
        padding: 0 5px;
    }
}
.iconDis{
    width: 100%;
    display: flex;
    align-items: center;
}
.pinDisplay{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    .btn{
        padding: 7px 10px;
        background: #11d1b0;
        color: #fff;
        border-radius: 4px;
        text-align: center;
        margin: 0 5px;
        cursor: pointer;
    }
}
</style>
